<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<link href="../css/style_wln.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../js/calendar.js"></script>
<script type="text/javascript">
    Date.prototype.Format = function (fmt) { //author: meizz
        var o = {
            "M+": this.getMonth() + 1, //月份
            "d+": this.getDate(), //日
            "h+": this.getHours(), //小时
            "m+": this.getMinutes(), //分
            "s+": this.getSeconds(), //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }

    function onloadCalendar(){
        var temp = new Date();
        var year = temp.getFullYear();
        var month = temp.getMonth()+1;
        var day = temp.getDate();
        month = month>=10?month:"0"+month;
        day = day>=10?day:"0"+day;
        document.getElementById("cur_dt").value = year+""+month+day;
        //alert('year = '+year+',month='+month+',day='+day);
        selectCalendar(year, month, day);
    }

    function selectCalendar(year, month,day){
        var temp = new Date(year,month,0);
        var monthday = temp.getDate();
        var firstDay = new Date(year+"/"+month+"/01");
        var firstDay_Week = firstDay.getDay();//获取当前星期X(0-6,0代表星期天)
        var display_line_num = Math.ceil((firstDay_Week+1+monthday)/7);//通过第一天星期几加上天数，就可以知道这个月显示多少行
        var all_date = "";
//        alert(firstDay_Week);
        firstDay.setDate(firstDay.getDate()-firstDay_Week);

        var calendar_week = '<p style="color: #b04343">日</p><p>一</p><p>二</p><p>三</p><p>四</p><p>五</p><p style="color: #b04343">六</p>';
        document.getElementById("calendar_week").innerHTML = calendar_week;

        for(var i = 0;i<7*display_line_num;i++){
//            all_date += firstDay.Format('yyyy-MM-dd')+"    ";
            var f_year = firstDay.getFullYear();
            var f_month = firstDay.getMonth() + 1;
            var f_day = firstDay.getDate();
            f_month = f_month>=10?f_month:"0"+f_month;
            f_day = f_day>=10?f_day:"0"+f_day;
            var dt = f_year+""+f_month+""+f_day;

            var nl_data = calendar.solar2lunar(f_year,f_month,f_day);
//            alert(nl_data);
//            eval("var nl_json = " + nl_data);
//            alert("aa");
            var nl = nl_data.IDayCn;
            if(f_year == year && f_month == month){
                if(f_day == day){
                    all_date += '<div id="'+dt+'" class="this_day" onclick="select_date(this,'+f_year+','+f_month+','+f_day+')"><p>'+f_day+'</p><p>'+nl+'</p></div>';
                }else{
                    all_date += '<div id="'+dt+'" class="this_month" onclick="select_date(this,'+f_year+','+f_month+','+f_day+')"><p>'+f_day+'</p><p>'+nl+'</p></div>';
                }
            }else{
                all_date += '<div id="'+dt+'" class="other_month" onclick="select_date(this,'+f_year+','+f_month+','+f_day+')"><p>'+f_day+'</p><p>'+nl+'</p></div>';
            }
            if(i>0&&i%7==6){all_date+="<br>";}
            firstDay.setDate(firstDay.getDate()+1);
        }
        document.getElementById("calendar_date").innerHTML = all_date;

        select_date(this,year,month,day);
//        alert(all_date);

        /*var temp = new Date(year,month,0);
         alert(temp.getDate());//得到某个月的天数
         */
//        var firstDay = new Date(year+"/"+month+"/01");
//        alert(firstDay.Format('yyyy-MM-dd'));
    }

    window.onload=onloadCalendar;

    function select_date(obj,year,month,day){
//        month = month>10?month:"0"+month;
//        day = day>10?day:"0"+day;

        //先声明一个异步请求对象
        var xmlHttpReg = null;
        if (window.ActiveXObject) {//如果是IE
            xmlHttpReg = new ActiveXObject("Microsoft.XMLHTTP");
        } else if (window.XMLHttpRequest) {
            xmlHttpReg = new XMLHttpRequest(); //实例化一个xmlHttpReg
        }

        //如果实例化成功,就调用open()方法,就开始准备向服务器发送请求
        if (xmlHttpReg != null) {
            xmlHttpReg.open("get", "../behind_manage/wln_lhl.php?dt="+year+"-"+month+"-"+day, true);
            xmlHttpReg.send(null);
            xmlHttpReg.onreadystatechange = doCallBack; //设置回调函数
        }

        function doCallBack(){
            if(xmlHttpReg.readyState == 4){
                if (xmlHttpReg.status == 200) {//200代表执行成功
                    //将xmlHttpReg.responseText的值赋给ID为resText的元素
                    //document.getElementById("resText").innerHTML = xmlHttpReg.responseText;
                    var result = xmlHttpReg.responseText;
//                    alert(result);
                    eval("var json= " + result);
//                    alert(json['curdt']);
                    document.getElementById('curdt').innerHTML = json['curdt'];
                    document.getElementById('yi_list').innerHTML = json['yi_list'];
                    document.getElementById('ji_list').innerHTML = json['ji_list'];

                    var temp = new Date(year+"/"+month+"/"+day);
                    var nl_data = calendar.solar2lunar(temp.getFullYear(),temp.getMonth()+1,temp.getDate());
                    var ml = nl_data.IMonthCn;
                    var nl = nl_data.IDayCn;
                    document.getElementById('curndt').innerHTML = ml+nl;
                    obj.setAttribute("class",obj.getAttribute("class")+" selected_day");
                    var last_selected_dt = document.getElementById("last_selected_dt").value;

                    var lsd = document.getElementById(last_selected_dt);
                    if(lsd != null) {
                        var lsd_nw_class = lsd.className;
                        var lsd_od_class = lsd_nw_class.replace(/selected_day/, "");
                        lsd.setAttribute("class", lsd_od_class);
                    }
                    month = month>=10?month:"0"+month;
                    day = day>=10?day:"0"+day;
                    var format_dt = year + "" + month + "" + day;
                    document.getElementById("last_selected_dt").value = format_dt;
                }
            }
        }
    }

</script>
<body>
    <div class="title red_write">
        <p><a href="wln.html">返回</a></p>
        <p>老黄历</p>
    </div>

    <div class="main_content" style="height: 1800px;width: 100%;">

        <!-- BEGIN #main -->
        <div class="calendar_area">
            <div id="calendar_week"></div>
            <div id="calendar_date"></div>
            <input type="hidden" id="last_selected_dt">
            <input type="hidden" id="cur_dt">
        </div>

        <div class="date_area" >
            <div class="text_center">
                <div class="hor_line_half"style="width: 18%;margin-bottom: 35px;"></div>
                <p class="cur_date display_inline_block color_red" id="curdt">12月16日</p>
                <div class="hor_line_half" style="width: 18%;margin-bottom: 35px;"></div>
            </div>
            <p class="cur_date_n color_red" id="curndt">十一月初四</p>
            <p class="cur_weather color_glod" id="cur_w">晴转多云，东北风5至6级，多穿衣服</p>
            <div class="cur_date_yj_area red_write">
                <div class="cur_date_yj">
                    <p>宜</p>
                    <p id="yi_list">嫁娶  吃饭  开光  吃饭</p>
                </div>
                <div class="cur_date_yj">
                    <p>忌</p>
                    <p id="ji_list">嫁娶  吃饭  开光  吃饭</p>
                </div>
            </div>
        </div>

        <p class="zr_title color_red">快速择日</p>

        <div class="zr_area">
            <div class="border_red color_red">嫁娶，吃饭</div>
            <div class="border_red color_red">嫁娶，吃饭</div>
        </div>
        <div class="zr_area">
            <div class="border_red color_red">嫁娶，吃饭</div>
            <div class="border_red color_red">嫁娶，吃饭</div>
        </div>
        <div class="spr_line_half">
            <div></div>
            <p>解梦万历年</p>
            <div></div>
        </div>
    </div>
</body>
</html>